Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[김은재] Week19 #489

Conversation

rladmswo1715
Copy link
Collaborator

요구사항

기본

  • 변경된 api를 활용해 주세요.
  • 모달에 필요한 api 요청을 만들어 기능을 완성해 주세요.
  • api 요청에 TanStack React Query를 활용해 주세요.

주요 변경사항

멘토에게

@rladmswo1715 rladmswo1715 requested a review from lisarnjs June 28, 2024 13:28
@rladmswo1715 rladmswo1715 added the 미완성🫠 죄송합니다.. label Jun 28, 2024
Copy link
Collaborator

@lisarnjs lisarnjs left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

은재님 스프린트 미션까지 진행하시느라 고생하셨어요!
코드가 전체적으로 좋네요 👍
곧 프로젝트니까 한번씩 더 다듬고 내가 코드를 어떻게 짰는지, 왜 이렇게 짰는지만 잘 정리해두시면 좋을 것 같네요!

이번주도 화이팅입니다 :)

userToken: string
) => {
const response = await fetch(`${BASE_URL}/links`, {
method: "POST",
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

HTTP메소드들도 함수 util로 분리한다면 fetch 함수를 사용하는데 더 확장성 있게 사용할 수 있을거에요!

export const post = async (url, body) => {
  return await fetch(`${BASE_URL}{url}`, {
    method: 'POST',
    headers: {},
    body: body
  })
}

export const addLink = () => {
  const body = JSON.stringify({
      url: linkUrl,
      folderId: folderId,
  })
  return post('/links', body)
}

const userInfo = useContext(UserInfoContext);

const changeInputFolderName = (e: React.ChangeEvent<HTMLInputElement>) => {
setFolderName(e.target.value);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

e.target vs e.currentTarget의 차이점을 아시나요?!

👇🏻혹시 모르신다면 아래를 참고해주세요!
https://velog.io/@sunkim/Javascript-e.target%EA%B3%BC-e.currentTarget%EC%9D%98-%EC%B0%A8%EC%9D%B4%EC%A0%90

@@ -39,11 +48,40 @@ const LinkAddContent = () => {
setFolder(selectedFoler.current[i]);
};

const handleLinkAdd = useMutation({
mutationFn: () => {
if (!userInfo || !userInfo.token) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

옵셔널 체이닝을 여기서 사용해도 좋겠어요!
!userInfo?.token

handleLinkDelete.mutate();
};

const handleLinkDelete = useMutation({
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

요런 react query를 사용해서 데이터를 업데이트하는 로직도 커스텀 훅으로 빼면 더 좋을 거 같아요 👍

localStorage.setItem("userToken", result.data.accessToken);
setUserToken(result.data.accessToken);
localStorage.setItem("userToken", result.accessToken);
setUserToken(result.accessToken);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

로컬에 저장하는데 state에도 저장하는 이유가 따로 있을까요??

@lisarnjs lisarnjs merged commit 7a29357 into codeit-bootcamp-frontend:part3-김은재 Jun 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
미완성🫠 죄송합니다..
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants